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مقدمه4: 
*یعتبر برنامج ط٤۷‏ «٥iیوەام×E‏ من البرامج الجدیدة حیث آنه بدیل لبرنامج ٤عھ٣ ۴٣٣٣۲‏ ویطلق 
عليه ٥۶ھ‏ ٤٣٥آ ٣۴‏ الجدید 
*تعريفه : هو برنامج جاهز يستخدم في إنشاء صفحات ويب لتصميم موقع بالكامل 
. فبرنامج اعءس «٥10یومام×٤‏ هو الخليفه لبرنامج التصميم الشهیر ٤عدم ۴۲١٠٠١۲‏ و الذي اعتمدته 
ميكروسوفت سابقا كمنتجها لتصميم المواقع . 
*فو ائده: - 
-١‏ السرعة في تصميم الموقع مما يوفر الجهد والوقت 
۴- مجموعة القوالب الجاهزة 
۳-تحتوي واجهة البرنامج على العديد من المكونات التي تساعدك في التمام أعمالك بصورة ممتازة. 


*ممیز أت الير نامع : 

-قدرة البرنامج على إنشاء صفحات بشكل جذاب من خلال أشرطة الآدوات )كج1 s¢ممرم٣‏ 
= سهولة الإاستخدام 

۳- إنشاء موقع ويب كامل 


م 


*التعر ف النافذة الافتتاحبa‏ adرzali Expression Web‏ :- 


* لابد أن نلاحظ جيدا أن طريقة تشغيل البرنامج لا تختلف عن باقي البرامج الأخرى ولكن بالنسبة 
لواجهة البرنامج تختلف بشكل ملحوظ من حيث ظهور صفحة ويب ( منطقة التصميم) والتي تتكون من : 
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١:‏ -<رل0(ا> جسم الصفحة وبها يظهر محتوى الصفحة 
۲- التبويب عله : وند الضغط عليه يقوم بعرض الأوامر ( الأكواد - التعليمات ) الخاصة 
بمحتو ی الصذدة وتسمى هذه الاوامر بأغ XML - CSS- - HTML‏ 
-٣‏ التبويب ٤1اذم؟‏ : عند الصغط عليه يظهر انقسام للصفحة جزءين جزء للكود والآخر للتصميم 
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Task Panes Û *أقسام المھام‎ * 

تشبه في فكرتها أشرطه الأدوات ... و هناك العديد من ال كع٣ه۴‏ )هآ المفيده المدرجه مع 

البرنامج» منها مثلا: 

as) Pane Folder*‏ ءال وضعها الافتراضي في اعلي يسار البرنامج ... و بها تظهر جميع 
الملفات التي تقوم بادراجها في موقعك ... و تساعدك في ترتيبها و تنسيقها بشكل منظم 

o> ras) Pane*‏ |100 و ضعها الافتراضي في اعلي يمين البرنامج ... بها تظهر مجموعه من 
الادوات التي يمكنك اضافتها لموقعك مثل ال ٥٣۳٣ه۴۲‏ و ال مله ا و ال Buttons‏ " سنري 
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أذازة مثبة الت صر التحلمة تو جه الکسو تر ۔اغذاد حامت کوان مو حه گسوتر 
**البحث: تستخدم هذه الإمكانية في البحث عن كود أو سطر في الصفحات ويتم إدراج نافذة البحث من 
قائمة nes‏ ھ۴ یھ٦‏ نختار f۵1‏ أو f42‏ فتظھرا لنافذة 
أسفل منطقة الكتابة وللتعامل مع النافذة نضغط على الزر 
فتظهر نافذة لكتابة النص المراد البحث عنه 


*تعريفه :يمثل الويب ط٠‏ كافةالمحتويات التي يتم مشاركتها أو وضعها أو الإطلاع عليها من خلال الانترنت. 
*مكونات الويب : 
-١‏ النصوص 1٥×)‏ :- هي العنصر الاساسي لتكوين محتويات مواقع الويب»وعندما نقوم بإعداد 
الموقع على الويب فإنه بإمكانك تنسيق النص كما في برنامج ١١0س.‏ علما بأن المواقع في البداية 
كانت تعتمد على النصوص فقط. 
4- الصورsءعوهوص"[:-‏ وفقا لتطور الويب أصبحت الصور من العناصر الأساسية في موقع ويب 
وعادة ماتكون الصور الموجودة في صفحات الویب من نوع 61۴,3۲6 حيث أن هذه الأنواع من 
الصور تأخذ مساحة تخزينية صغيرة وفترة أقل عند التحمیل . ومن البرامج 0pطءہtہط۴۔.‏ 
-٣‏ الروابط كما : تعتبر الراوبط هي الفكرة الأصلية في انشاء الويب حيث يتم من خلالها 
استعراض صفحات الويب بالتنقل من صفحة إلى أخرى ولاتخلو صفحة ويب من الروابط 
؛- الجداول sعاطه1:تستخدم‏ الجداول أساسا في صفحات الويب لتنظيم البيانات . 


-٥‏ الاطارات sعمصه٣۴:‏ هي طريقة من طرق تصميم صفحات الويب وتعتمد على تقسيم نافذة المستعرض 


فا جم افر فیس سور فی ا 


i a ë mm md | a 1 آ َ َة‎ 
و سز لی‎ E ل‎ ms ف‎ 
i a Em j r ك . | ت‎ i: ا ت‎ i ۰ 
1 LE LL ت ا ا 1 ا ا ا اغ 5 ا‎ Î 
SÎ i E iF f 1 [4 ı ۴ 1 
. 


- النماذج كصإه۴: النماذج هي أجزاء في شکل مستطیل ا کات اا 
زائري موقع ويب وبعد ذلك يتم ارسال البيانات . 
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۷- الوسائط المتعددة هdiعء”ص‏ )اا1 :مئل تسجيلات صوتية أو لقطات فيديو أوبث مباشر »› حيث 
أصبحت من العناصر الشائعة في المواقع› وقوى الجذب 
التعا صفحات الوبب 


e‏ ¢ مې 


و لا : إنشاء صفحة ويب :من قائمة ٥ذ۴‏ نختار سء ومنها ءعه٣‏ تظهر نافذة بعنوان 
New‏ نختار منھا التبویب ع)٤آsا٥‏ ۷ نختار اaداعءمرع6‏ تظهر عدة اختیارات iختlر One Page‏ 
ئا ثم نحدد مكان لحفظ الصفحة من خلال الزر 8٠۷٠٠‏ وفي عدم تحديد مكان للحفظ فسوف 
يقوم البرنامج بحفظ الصفحة في المجلد ع)¡؟S .My Documents/My Web‏ ثم نضغط 0K‏ تظھر 
الصفحة ١ط.٤1اuدء‏ يتم الضغط عليها ضغطتين فنشاهد صفحة فار غة تماما وکأنها مستند W0۲٣‏ 
يمكنك الان الكتابة قم عبارة 

' الحبيبة مصر' في منتصف الصفحة وفي بداية السطر التالي نكتب " علينا أن نخلص العبادة لله 
و نجتهد ونجد من أجل أن يمن علينا الله بالنصر والتأييد ' والآن نقوم بحفظ الصفحة ثم نقوم 
بمعاينة الصفحة من قائمة ١ء۴1‏ نختار سعذرء۲ فنجد أنه تم عرض الصفحة في المستعرض 
»[nternet Explorer‏ ونلاحظ أن عنوان الصفحة عبارة < رل0ط > جسم أو هيكل الصفحة ويقصد 
به محتوی الصفحة ونجد أسفل الصفحة كما علمنا من قبل ما يسمى Design‏ و Spilt‏ و Code‏ 
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حتفا آن تكثصر انعبات د نله و تنجد و تجتچد ‏ صن آ جل 
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التعرف على الكود مdهح‏ 
نلاحظ الكود التالي: هي مجموعةمن أوامر لغة 1۲M)‏ فهي تشير إلى الاختصار عموحuوہجا‏ 
1yp٩er rext Markup‏ فهي المسئولة عن عرض البيانات على شكل صفحات في المستعرض 
وهذه الأوامر تسمى كوهآ۲ ( الأوسمة ) .وتم تطوير هذه اللغة إلى XH‏ حیث تتمیز بتطویر 
أكثر مما ساعد على سرعة تصميم المواقع فتم اضافة التي في M1‏ 1۲× :- 
أولا :إضافة الكود 

<?xml version="1.0" encoding="UTIF-8"?> 
تكون اعلى كل صفحة قبل بداية الاخراج ويجب الا يكون قبلها مسافات ( ءمعهمء ٥1ا۷ التی قد‎ 
تصدر عن بعص المحررات‎ 


ثانيا تحديد نوع الصفحة والمصحح لها من خلال الكود : 


×1 (الذى يعمل على اخبار المتصفح ان نوع هذه الصفحة هو‎ 0 P٤ 
والذى يساعده على محاولة تصحيح بعض الاخطاء اثناء العرض لذا يجب الا تخلو اى صفحة منها‎ 
:۴٣aمه الكود التالى خاص باالاطارات ئم"‎ 


DOCTYPE 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 
Frameset //EN'" 
"http: //www.w3.org/TR/html4/ frameset .dtd"> 


Header and Footer الکود التالی خاص باالرأس والتذییل‎ 
<html> 
<head> 
</head> 


<body> 
</body> 


Folde.,,. E E DH # 


E default.htm ™.. + onlhon. n! | 
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1 <head> | 
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إنشاء موقع طe¥‏ باستخدام التو لب Templates‏ 


من قائمه ھ[آ۴ اختر الأمر New‏ iۃp‏ |ختر Web Site‏ 


1 e i Pri Er E r 1 ا‎ RT ا ی و‎ 


: 1 
1 
ك‎ 
م‎ . 
Fake a ney Web ska itha angle bark 
E a 
4 
: 
٣ 
ا‎ ۱! 
2 ۳ 

: : أ‎ 
: SpE Eee location of e Regi Heb kê: : 
1 

۳ LPOoemerts ard Sattrige ba zleza EME Docent web Sesi ramtded3 أ‎ 
3 ۴ 
7 | 
ر‎ 

! 


Tr 


E E EE E OR REE RE 
تجد به تبوبين .. احدهما لإنشاء أو أدراج صفحه جديدة أما الآخر فهو لإنشاء‎ ۵W مربع حوار‎ 
موقع جديد اضغط علي ا٥۷ كما في الشكل ...الاختيار اجام" ع به تجد ۳ أنواع من المواقع‎ 
. موه عn٥ سيقوم البرنامج بإنشاء موقع يحتوي علي صفحه وحيده‎ W6 S¡†٤ يمكنك إنشائها‎ 
يمكنك قطعا إضافة ما تريد من صفحات‎ 

بعد ذلك ۴E" ۷ Wb S٥‏ يقوم البرنامج بإنشاء موقع فارغ تماما 


۴٣0٣۸٤ يمكنك استخدام هذا الخیار إن كنت بدأت تصميم موقعك علي برنامج‎ 1[mport web site 
اعمس حيث سيساعدك هذا المعالج‎ ٤۴×م‎ ۲٤5۶10۸ م۴ و ترید الان تكملة تصمیمه علي برنامج‎ 
في إتمام عمليه التحويل و النقل بين البرنامجين‎ 

Template تار‎ |aÎ 

فستجد به مجموعه من التصميمات الجاهزة التي يمكن التعديل فيها لتتناسب مع احتياجك 

One Page Web Site jail General sء‎ jجئll‎ ja الان‎ 

حدد المكان الذي تريد حفظ موقعك به من الخيار 

Specify the location of the new web site 

بشکل افتراضي اذا لم قم بتغير هذا الخيار سيتم حفظ الموقع في مجلد My Web Site‏ الموجود 
داخل المجلد الشهير My doCuUn?1€/†‏ 
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اضغط )© ... ليبدا البرنامج في انشاء موقع من صفحه واحده كما يلي .. 


FE lar amt anid Sefeq ES LE RTA r Dac amie ob SOS elel _ E Taze Tiga Wa Ex 


Em E eee eet Fema Tob Tab e aha aa 1 Tek Pre im BH 


rll, E,‏ سات ا ت || کے ا ا 
e ordre od Gaga dl ira hila A] FPF ho rari êt a aT E‏ 3 
ا Haa] ae E‏ و کت Fig‏ 
ا [EH Fin LET OT 1 PY‏ کک رو | 
f, defa ` page read‏ 
EEF FEMAHTE. IE‏ ..„. 
amg Jeet Doble Clk TE "Hefa page‏ 
iî Bari êrêalê ke fê" ê êlê êmê pajê :‏ 
1 0 
ج شرت با ی a a E Hz‏ 


1 i 
سے ت‎ 
EE Riera el Se Bete Bikers 


تلاحظ أن البرنامج قام بتسميه الصiحة‏ ب— Defualt.h‏ 

ملحوظة ... يجب أن يحتوي موقعك علي صفحه واحدہ فقط بعنوان De ؟uھا ٤.‏ او 
1[n"de>.M‏ .... و هذه الصفحه ( يجب ) ان تكون هي الصفحه الرئيسيه للموقع ... 

حيث انه عندما تقوم برفع الموقع علي مساحه الاستضافه الخاصه بك يقوم السيرفر بتحميل اي من 
هاتين الصفحتين بشكل افتراضي في البدايه معتبرا انها هي الصفحه الرئيسيه ... ولا يمكن تغير هذا 
الاختيارالان لتبداً في الكتابة داخل صفحه موقعك الرئيسية يكفي أن تضغط مرتين )c‌iاC٥C Double‏ 
علي اسم الصفحة _ كما هو موضح في الشكل السابق 

برنامج اكسبريشن ويب هو احد برامج تصميم المواقع التي تستخدم تفنيه ١6‏ ۸۷51¥ و التي هي 
اختصار ...Nhat You See Is What You Get‏ تترجم .. " ما تراه هو ما تحصل علیھ ' 
و المقصود بها ... إن ما تراه إمامك في مرحله التصميم هو نفس ما سيراه الزائر في مرحله التشغيل 
لهذا فان مرحله التعديل أو بدء الكتابة في صفحتك الرئيسية لا تختلف في كثير عن الكتابة داخل أي 
مستند من مستندات برنامج ۷0۲٩‏ 

هناك خطوه مهمة للغاية يجب ان نتذكرها دائما قبل البدء في الكتابه او تعديل الصفحه ... و هي ضبط 
قياس الصفحة ... يمكننا ضبط قياس أو مساحه الصفحة بأي من الطريقتين التاليتين: 


أولا .. من شريط الحاله ٣3ط‏ كuاهك‏ في أسفل الصفحة كما يلي 
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م 
ج 


Glick to ajust your page 1 


ei es n 
i 433 bytes Standêr 


ا 


sizê 
retommended ... 955x600 


E 


ثانيا من قائمه ۷1W‏ اختر عzآكS‏ موه۴ ثم اختر المساحة المناسبة بشكل عام ... ٦٠٠× ٠٠١‏ 
و هي المكافئه لدقه سطح مكتب ۷٠۸ ٠۰۲ Resolu t٥٧ 0es) 0p‏ هي الاتسب و هي 
الشائعه الان في معظم صفحات المواقع ... 

أضف لصفحتك لها جمله الترحيب ك١۲1٣W0‏ ١٠|ااعم1‏ لعلك تريد ان تري صفحتك في وضع العرض .. 
أي كما سيراها الزائر 

من قائمه ۴٥‏ اختر الأمر ¡n Br0ws٥‏ سwعاvعا۴‏ ثم اختر المساحة التي تريد المعاينة عليها 
كما يمكنك بسهوله الضغط علي ١۱۲۴‏ 

لو لم تكن قد قمت بحفظ صفحتك حتي الان سيقوم البرنامج بسؤالك عما اذا كنت ترغب في حفظ 
الصفحه قبل معاينتها ام لا ... بالطبع ستختار نعم 


* *اضافه صفحات جدبدة لموقعك ... 
هناك طريقتين لأضافه صفحات جديده للموقع .. 
من قائمه ۴11٥‏ اختر الامر ٥۴W‏ ثم منه اختر الامر ٥وھ۴‏ ... 
كما تري هناك الكثير انواع الصفحات التي يمكنك انشائها .... سنتحدث إن شاء الله عن كل نوع 
أما الآن فأختر 1۲۳M)‏ و التي تسمح لك باضا فه صفحه فارغة جديدة 
يجب أن يكون الشكل أمامك مشابها لما يلي 
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= Text File 
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ا‎ i Peake Fram Crriamic eb Template. 


0 rêê rûm ager Fig. 
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ا قر ا ر 
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Folder List Task فى lلجjء lاlئخاص ب‎ 


UWntitled Untitled 1 him) - Microsoft Expression Wêl‏ آ 
Ble EK ew eet Fart Tools Tak ste Lata eve TakPaneês Wd Heb‏ 1 


E EE N. CS „(Default Fort) a EEE sS 
E ا‎ 


EFE TT ard Sete bales) E 
I fa def ault.Hem IE 


herê It's .... Save Itto have 
listed in the "Folder List 
Task Pan 


Where is my New 
wreated Page 


: ف ۲ ا ا و e‏ نے Hh aE. TE‏ ا و ا وی د د ار پو د ET E E‏ 1 


بل يجب عليك أولا ان تقوم بحفظها لتظهر . 
اضغط 8S‏ + | أو اختر الأمر S2۷6٥‏ من قائمه ٥ا۴‏ 


es te » 
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في الحالتين سيظهر أمامك مربع الحوار التالي _ 


Fete 


7 a ۲ 
E Easier aad rge, AL SFE Een Ft ab SE aS ا و | ا‎ 
Edam 5 
د‎ 
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يمكنك بالتأكيد إعطاء أي اسم تريد لصفحتك .. لكن من المفضل أن تحدد اسم يعكس محتوي الصفحة 
أيضا لا يفضل استخدام المسافات في تسميه الصفحة كما لا يفضل أن تستخدم اللغة العربية في تسميه 


الصفحة بعد تحديد اسم لصفحتك 
Task Pane Folder List‏ 


S2۷٥ اضغط‎ ... 


LIntitled 1 {(C:Mocinmenits and Settineslbazlezro. MT HMYyY Uo‏ ایت 


jE Insert FûrtrmaE Toals Table SIE Gala Wie 


 TODefaulE Font} ج‎ 


CA ICES web Sitê | About us.htm 


Bad ss 


حفظ الموقع و إنهاء العمل 
لاحظ انه يجب إن تقوم بحفظ كل صفحه علي حدا . 


و الان لإغلاق الموقع اختر الامر عآ؟S‏ مsها€‏ من القائمه ٥ا۴‏ 


EHit 


رہد | > عا ا > ا 


Note that your page 
now listed in the 
"Folder List" 
TaskPan 


... و لاحظ ظهورها في الجزء الأخاص ب 


: FEilë 


3 


EalderLisE., 
E cADocuments and Settings1ba2lezû | | 
Faî default. htrn ا‎ 
a About us. hErn 


لاحظ ان الامر |٠58‏ يقوم بأغلاق الصفحه الحاليه فقط و لا يقوم بأغلاق الموقع كاملا 
كذلك الامر 08١‏ حيث يقوم بفتح صفحه واحده و ليس كامل ملفات الموقع 


ضبط خواص الصفحه 
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يمكن الوصول لمربع حوار خصائص الصفحه Page P٥ pe٤ es‏ عن طریق الامر sعز)erمpہPr‏ من 
قائمه ۴11e‏ 


dE) CC Mroc uments an cl settings 1 
Edi tie Insert Formal 


| ٣ Esorare 1 


ا :ا Gpënzî.. wErl#ra‏ = 1 
اریہ ا2ہ ا ta Open Site:..‏ ا 


ا کے 


lose SEE 


| کے‎ e wErFl#ES او‎ 


کت چ 


I ااکہ حسد<‎ 
Fu blish Site... 


IrnpiarE سے‎ 
Ez parE تا‎ 


أو عن ن طر يق اختيار الامر E‏ بعد الضغط کلیك یمین في أي مكان علي الصفحة 


° aê Proper 


| seneral | Formatting || ûdYanced | custom | Language | Workgroup 


ا ا 5 
اا ا "“ ب n 1 wa EEE‏ 


Location: File E Docurments and Settings badlêzo M1 FHRTY DoEUME 
Title: | 


Pagê descripktiûn: 


EEeYmorAÎS! 


Base location:‏ ر 


Default target Frame: 7 | 
| آ‎ mm 


1 Page Direction: Morê ا‎ 


Background söuîd = 


Location: Browse, 1‏ آ 
| 
| 
| 


Lonap: آ‎ Foftewer 


في التبویب 41ا ¢»ء‌G‏ 
6ئ۴ .... لكتابه عنوان الصفحه كما سيظهر في شريط العنوان إدط ء1)1) وقت التنفيذ 
Page Description‏ و Keywords‏ کان یتم استخدامھم قدیما عندما کانت محرکات البحث تراجع 
القيم الموجوده بهم .. لكن الان لم تعد محركات البحث تعمل بهذه الطريقه لذلك لم يعد من المهم 
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direction‏ مع۴a‏ لضبط أتجاه الصفحه سواء من اليمن الي اليسار او العكس 
Background Sound‏ ... لتضع خلفيه موسيقيه تعمل عند تحميل الصفحه. كما يمكنك التحكم في 
عدد مرات تكرار هذه المقطوعه او جعلها تعمل بلا انتهاء و ذلك Loop ( Forever رlيخll ja‏ ( 
في 


م کے ا : 


FOF 2))11£ التبويب‎ 


س ق 
ا کے ر کک س 


: سسس س ر 
2 و ا ا 
Page Properties 8 0‏ 
. ت 1 . 1 2 a. CR CESED E tT‏ — ار 

1 j General | Formatting Advanced  Zustom | Language Workgroup | 

Background ~‏ ا 

: [ Background picture 

) 

| 

2 Lolars 

Background: | | | @uitormiatic w | Hyperlink: | J Automatic 

1 ت‎ a a e ms a o a ma e meme mn mE — 2 کس س تک ن س ا ك‎ a = 

8 TEx: E oitomakic w | Wisited hyperlink: WÎ Automatic 

ج = 2 1 

n Active hyperlink: I Automatic 

Howered Hyperlink: FM Sit omatic 

ر 

7 5 

r mor ader com‏ م 


1 
ی کی ی و و ی ی کو کک 
Background Picture‏ .... لأضافه صوره کخلفيه للصفحه 
تحت مجمو عه الخيارات الخاصه بالأوان كإهاه آ٣‏ 
¡014ايعه8 لتغير اللون في خلفيه الصفحة 
٥×‏ لتغير اللون الافتراضي للنصوص 
م«ناإمم ر .... لتغير اللون الافتراضي لاي روابط موجوده في الصفحه 
inGاrمhyp‏ dعVİsit‏ ... لتغير لون الروابط التي تم زيارتها سابقا 
g«نااممرط‏ مActiv‏ لتغير لون الروابط التي يتم الضغط عليها 
Hovered hyperlink‏ ... تغیر لون الروابط عندما یتم الوقوف فوقھا بالماوس بدون ضغط 
يعتبر التبویبين ٤٣21‏ "ع6 و ع«ذا)aص۳ ۴٥۲‏ هما الاكثر شيوعا . 
التعامل مع النصوص 


تعرفنا فيما سبق علي كيفيه بدء مشروع جديد و كيفيه حفظه و استدعائه مره آخري لاستكمال التعديل عليه نتعطم 
كيفيه تنسيق النصوص داخل الموقع ... 
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بشكل عام لا تختلف مهارة تنسيق النصوص في برنامج we‏ «٬٥اییءام×٤‏ عن مثيلتها في برنامج ١١ا٥۷‏ و إن 
کنا لابد أن نتذكر أن ا٥س‏ «٥ءوءام×E‏ هو في الأساس برنامج لإنشاء المواقع و ليس لتحرير النصوص مما يعني 
إن إمكانياته في هذه النقطة ليست بالتأكيد مثل إمكانيات برنامج ال .W0۲١‏ 

تنسيق الفقرات lormalting Faragraphs‏ :من قائمه O‏ اختر الامر Paragraph‏ 


س ت کے کے ر 


1 ETE e 
| IndenEs and Spacing | 


7 
4| Alignment: | BEFSUIEÎ 2l Giraction: ûne 


IndeEnEaEion 


LEFE side: ا‎ Indént First line: 


REigHE side: 


SEAN 2 


Before: Liîë sSpãcinî: 


2FEer: 
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ord: 


FPFFewimyy —‏ چ 
ا 


2 ESBS ig 
3 


۳ د ا e E‏ ی 2 ص ل gts ame‏ ا a. gga.‏ ي ی 


يمكنك من الخيار Ahn‏ ضبط محاذاة النص ( یمین - يسار - توسيط ... الخ 0 

و من الخيار ١٥٤ء٥51۲[‏ ضبط اتجاه النص سواء من اليمين إلي اليسار Right to 1eft‏ و من اليسار إلي اليمين 
htعiا eft t0‏ أما مجموعه خيارات ١٠٥ناه٤ 1"٥,‏ فهي المسئولة عن إزاحة النص مسافة محدده سواء لليمين أو 
اليسار كما يمكنك إزاحة السطر الأول فقط عن طریق الخیار ٥ہ¡‏ ٤۶ا۴‏ 

مجموعه خيارات ع«ذءدم؟ هي |١‏ لمسئوله عن المسافات بين كل طمةإعهإه۴ و الذي يليه .. حيث يمكنك ضبط 
المسافة بين ال طمدإعهاه۴ الحالي و الذي يسبقه من الخيار ١١٠ء8‏ او المسافة بينه و بين الذي يليه من 
الخيار ۸)٥‏ كما يمكنك ضبط المسافات بين سطور ال طمدواودواإم۲ نفسه من الخيlار Line Spacing‏ أو 
المسافات بين الكلمات نفسها و ذلك من الخيار W0۲١‏ 

لاحظ أن جميع القيم التي تدخلها ستظهر نتيجتها في الجزء الخاص ب سع ا۷٥۲‏ حيث يمكنك مشاهده نتيجة تعديلاتك 
قبل تطبیقها. تنسیق الخطوط ۴٥٥٤ ۴٥١٣۸۵٤‏ من قائمھ ٤aہآہf‏ اختر الأمر t٤ره؟‏ 
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ر لاف ال س 

يمكنك من صندوق الحوار هذا ضبط الخطوط المستخدمة في الصفحة و ذلك من الخیار ۴٥١۲‏ كما يمكنك اختیار شكل 

الخط (تقيل Bod‏ أو مائل ااه ... الخ ) من الخیار ماو)؟ ۴٣۲٤‏ و أيضا حجم الخط يمكنك اختیارہ من ۴٥۸٤‏ 

م من الخيار اهاه يمكنك ضبط لون الخط أما مجموعه خيارات ء)ءء؟۳ فهي لأضافه مجموعه من المؤثرات 

علي النص المحدد ..في الجزء الخاص ب سء ۲٣۴۷‏ ستري تأثير جميع التأثيرات التي تختارها و ذلك قبل التنفيذ. 
اة 


Format 4مnئأla‎ ù Bullets and Numbering اک ختر الأمر‎ 


ae TT eg n a ' 


ت ي و SURELE LESTE‏ 
:ا خض و ا 


و سے 
uambears |‏ أ Picture Bullets |Flain Bullets‏ 


FicEurë 
J Use current CSS Stylë 


{J Specify picturë: 


BEF IMNSE, 


ا 1 . "= i ma‏ ت 
ر 2 کے ا a"‏ ب e pe r‏ “ 
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EulleE Direction: 
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کیک س 


aE ERA a ي‎ E ا ۲ ا‎ PEF 


تستطيع من التبويبات Picture Bullets‏ و Plain Bullets‏ و Numbers‏ اختیار اسلوب الترقیم الذي تریدہ 
من بين ۳ أساليب أساسيه ( صوره - نقطي - رقمي ) 

حيث يمكنك اختیار صوره معینه تستخدمها للترقیم في حاله استخدمت التبویب اء [اںB‏ eآںPict‏ 

أو اختيار احد الرموز التي يوفرها لك البرنامج في حاله استخدمت التبویب ٤اط‏ ہ1aiا۴‏ 

أو اختيار أسلوب الترقيم الرقمي من التبويب كءإ¢mbص Nu‏ 

إضافة الإطارات و ال 
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ا001" لإظهار شريط أدوات التنسيق اختر الأمر كادوطام٥]‏ من القائمه ۷ا۷ ثم منها اختر الأمر 
Formatting‏ 
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Copy / Past Properties | خبارات ال‎ 


عندما تقوم بنسخ روم٥١‏ نص من مصدر آخر سواء كان هذا المصدر احد ملفات النصوص أو موقع انترنت و تريد 
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لصق ۴4 هذا النص في الصفحة التي تقوم بتصميمها علي ال ط٤۷‏ ١٠٥اءیءام×‏ يظهر لك مجموعه من 
الخيارات كما في الشكل 


٤ 1 Match Destination Forrnattirng 
keep Source Formatting 
Hemoawe Formatting 


Keep HTML Gn 


Keêp Text Only... 


Match Destination Formatting‏ يحتفظ بجميع التنسيقات للنص الذي تم نسخه كما كان قي صفحته الاصليه 
Keep Source Formatting‏ يقوم بتحويل تنسيق النص بما يتناسب مع تنسيق الصفحة المنسوخ إليها 
Remove Formatting‏ حذف کافه التنسیقات من النص 

Keep HTML Only‏ يحتفظ بکود ال ۳۲1 الموجود في النص مثل الروابط مثلا 

Keep Text Only‏ تشبە Remove Formatting‏ مع الفرق انه یتبع هذا الخیار ظھور 8٥×‏ ٥1ھ(‏ يسمح لك 
بالتحكم في طريقه نسخ النص 


التعامل مم الصور 
-١‏ إضافة الصور 
۲- تنسيق الصور 
۳- شريط أدوات الصور 
؛- تحويل الصور ألي Thumbnail‏ 
٥‏ أضافه روابط علي أجزاء محدده من الصورة Hotspot‏ البقعة الفعالة) 
الصور من أكثر العوامل التي تميز و تضيف لصفحة موقعك .. . لذا فمن دمن المهارات الهام إتقانها هي كيفيه 
اضافه و تنسيق النصوص و التعامل مع خصانصها. معظم من يجيدون التعامل مع برنامج تنسيق 
النصوص ۷۷0۲4 0#١٠إء11‏ لن يجدوا سوي خلافات بسيطة ما يبن التعامل مع الصور في برنامج 
gy Word‏ برنامچ Expression Web‏ .. 
Apotiênts and Satins îlezo M1 AMY EET Wet? 8‏ شا 


Tools Table site Data iE Task Panes Wide 


+ (Default Sizê) 


about us.hEm e 


Eror Scanner of AMES...‏ و 


“E Interactive Button. 


TF Sembol... 


| ٍ 

أ 

اا ا 

be 
eee a aL ا ج و ا ی چ ےر .دا یړ‎ r یہ کروی‎ 


: 
اضافه الصور‎ 
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لإضافة صورة إلي صفحه موقعك ... من قائمۂ ٢إموہ[‏ اختر ا)ٺأمر From File ۃû Picture‏ 
" لاحظ انه لا یوجد Clip Ar)‏ ف„ ڊرnliچ "Expression Web‏ 

أختر الآن الصورة التي تريد إضافتها ثم اضغط ٤امیہ!‏ 

تلاحظ ظهور المربع الحواري التالي 


ّ ّ. - نة . 
ت . nm‏ -“ . - ي . 
E‏ ر کو س 8 س . ا FF‏ ا ”ص ka rh‏ ر ت a‏ ر 


ê Accessibility Properties 


Alternate text: | 


Larg description: text which 
display if the 


picture failed to 


Show Ehis prampt wheninserking imagês ا‎ 


PI?‏ وو کی د لی ری و ب داق ای ید 

حيث الخيار 4 iy text‏ . يمكنك هنا أن تكتب جمله مختصره ستظهر مكان الصورة في حالة لم 
یتم عرض الصورة أثناء التصفح أي سيب من الأسباب 

description‏ 0ngا....‏ هنا يمكنك وضع وصف مطول عن الصورة و ماذا تعبر أو ما لزوم وضعها في 
الصفحة ... أيضا سيظهر هذا الوصف في حالة عدم عرض الصورة لأي سبب. 

Show this prompt when inserting images‏ في حالة إلغاء هذا الخيار لن يتم عرض هذا 
السؤال مره أخري عند إضافة الصور. 


الان تري الصورة و قد تم إضافتها للصفحة اصغط الآن لحفظ الصفحة الأمر Save‏ من القائمھ F۴1]‏ أو 
احفظ الصفحة بأي طريقه ته تفضلها. 
اد سا هذه المرة تلاحظ ظهور الصندوق الحواري التالي 


Save Embedded Files 


Embedded Files to sae: PicEûrê pFEYjEW! 
Hamê Foaldêf Action 
| ERÎ aI Bmp E:1 TAYE 


| whange Folder, | SEE AacEioni,., | Picture File Type, ,, | 


| 

حيث يسألك البرنامج عن طريق هذه النافذة عن المكان الذي تريد حفظ الصورة فيه .. 

لاحظ أن الصورة لن تظل في المكان الذي إضافتها منه ( المكان المخزنة فيه علي الهارد ديسك ) بل سیتم 
نقلها ضمن ملفات الموقع و لذلك يسألك البرنامج عن المكان الذي تريد حفظها فيه حيثع¬4"ءR‏ .. 
لتغير اسم الصورة قبل حفظها 

Change F1der‏ ... لتغير مكان حفظ الصورة "المكان الافتراضي يكون مع الصفحة التي أضفت 
الصورة أيlq"" Picture File Type Set Action‏ 
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اضغط الآن »0 ... و قم بمعاينه الصفحة لتري الصورة كما إضافتها. 


تنسيق الصور 
تغير أبعاد الصورة ... 
٠‏ يمكنك ببساطه الضغط مره واحده علي الصورة ... تلاحظ انه تم تحديد الصورة .. الأن باستخدام 
مربعات التحجيم يمكنك الضغط و السحب عدا 4ه زا٣‏ لتغير حجم الصورة كما تريد ... لاحظ 
الشكل 


2 ر س 
سل ل ا ر 5 ا ا ا کوک ی ی ی ا ا سے 
د as‏ ا ا سے 2 ا ر س . GE a E‏ 


1 ™ nly PAoMIFY Size AEtributes 


I Resample Ficture To Match Size 


أيضا تلاحظ وجود مربع حواري صغیر به خیارین 


Modify Size Attributes‏ yا0n....‏ هذا الخيار يغير أبعاد الصورة فقط عند عرضها بدون حدوث أي 
تعدیلات ملف الصورة نفسه 

Picture to Match Sie‏ eاResamp‏ ... بالإضافة لتغير أبعاد الصورة أثناء العرض يمتد التغير 
ليشمل التعديل في ملف الصورة نفسها 

محاذاة الصور 

يمكنك الضغط يمين اا٣‏ ٤1عR1‏ علي الصورة و اختیار Picture ۴ا٥ مe ٤16s‏ ... أو ببساطه الضغط 
مرتين علي الأضورة Double Click‏ ... 

أي كانت الطريقة فسيتم عرض صندوق دوlر Picture Properties‏ 

نبد مع التبویب 21ء6 
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a 
1 


[ General | | appearance أ‎ 


a PI TT GocimEnEs fy Pictures, JP ا‎ EFE SE | 


Picture File Type. . 


1 


aT‏ آ س اک ا 
1ا 


Longa GDesrcripEion: 


LoOCZCaEiGn: 


Target FramÊ: | 


=“ 
ا 
~ancel‏ عص _] |[ عت 


7 ا س e‏ کے َ د سج ت و یی ی چ TE a a‏ 


من الخيار ٠إں)ءز٣‏ ستري المسار الذي تم تخزين الصورة به .... كما يمكنك استبدال الصورة بصوره 

أخري عن طريق الضغط علي م؛س٠١8B‏ و اختيار الصورة الجدید ہ 

من الخيار 1)yازط1وومءء۸‏ يمكنك تعديل ال 1٥×)‏ مادم إءع)۸1 الذي قمت بإدخاله عند إضافتك للصورة 

من الخيار مما امم ر يمكنك تحويل الصورة لرابط عند الضغط عليه يتم تحميل صفحه أخري و ذلك 

عن طريق الضغط علي مءسw‏ 80 حيث سيتم فتح الصندوق الحواري lاlخاص‏ ڊ Insert Hyperlink‏ 
lتبويپ Appearance‏ 


ج“ س و ج ی ےر 
e Picture Properties RES E‏ 
5 

E = eI 

ppEaranzeة‏ | ênêral‏ ج 

نے 2 

TF App ING SEE = :‏ ا 

E aaa ۳ 

چ 


L1 lm 
: Flore 1 LefFE REiğahE 


linen: GefFauUlE ا‎ Horizontal margin: U 
: : 


| ا 


0 


EGrder EAickness: ا‎ WerEical marain: 8 


3 F7 aise I 
Speécify size width: (313 FE Height: a04 
ا‎ | : 2 in pixels e ir pixels 
ٌ e irı perzenE E. ir pHerZreEnkE 
2 Keep aspect Fatio ل‎ 


1 
Caneel) 
EE EE Th > SÎ E ق‎ 


Wrapping Style‏ . .. تستخدہ م لضبط ال المحاذا: ة الأفقية NT‏ الخيارا“ ات الثلاثة 

....None‏ لا توجد محاذاة )fع1....‏ محاذاة لليسار)مآعاR‏ ... محاذاة یمین 

أما الخيار )uں0مره.]‏ فيحتوي علي مجموعه من الخيارات منها 

n1ءصn‏ ع1ا و هو خالص بالمحاذاة الرئيسية و يشمل علي مجموعه من الخيارات 

9p‏ ... و فيها يتم رفع الصور ليتساوي الحد العلوي لها مع السطر الذي وضعت في سياقه 
6ت ... يصبح السطر الموضوع به الصورة في منتصفها تماما 

Bott‏ ... يصبح السطر الموضوع به الصورة محاذي لحدها السفلي 

أما باقي الخيارات کی هذه القائمه فلم تعد ذات تأثير مع برامج التصفح الحديثة 

نأتي للخيار Size‏ 

حيث يمكنك منه تعديل مساحه الصورة كما تريد ... لاحظ أن لكل حجم اختيارين 

ا»ء×آ۲ [n‏ ... حيث ستدخل قيمة مطلقه للعرض أو للارتفاع 

In Percent‏ ... ستدخل قيمة تتراوح بين ١‏ إلي ۰ ,... متلا اذا كنت تريد أن يظل دائما عرض الصورة 
هو %٤١‏ من عرض الصفحة مهما كانت الدقَة رمن اموم R‏ التي تعرض فيها الصفحة 


b1 shi TT «» @ 14 <. The 2% abl » *‏ 6 م 1 h4‏ چ 
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0 {عءعمspه Keep‏ ... عند تنشيط هذا الخيار في حالة قمت بتعديل الارتفاع مثلا ستجد البرنامج يعدل 
عرض الصورة اتوماتيكيا 

وضع أطار للصفحة 

أضغط مره واحده علي الصورة لتنشیطها ثم من قائمه a‏ rہF۴‏ İختر‏ !لأمر Borders and Shading‏ 
... تلاحظ ظهور المربع الحواري التالي 


جج ج ج ی ی ی ی ی سے س a n‏ ا 


E ی‎ 


Borders and Shading ESE 


| Borders | Shading 


SEEEINA: 


lick on buttons belas Eo 


GeFalE 2p ply borders 


| = uıtarnaEîir ا‎ 
ith: 


Faddirıîa 
LeFE: 


FEighE: پک‎ EoEEûrn: 


> ص 


e e a a د س‎ 


بمكنك من هذه النافذة فذة التبديل بير بين أكثر من شکل للاطار و ذلك من الأمر Style‏ 

كما تستطيع اختيار لون محدد للإطار من الأمر اماه٣‏ 

أيضا سمك خط الإطار من الممكن التعديل به من الأمر إ)لW1‏ 

أما الجزء سء ء٣۴‏ فسيعرض لك مباشره جميع التأثيرات التي تختارها 

و لكن ماذا عن الأمر ورل له" الموجود في أسفل الصفحة ال عومزلقكه۴ هو المسافة بين الصورة و 
الإطار الموضوع حولها ...لاحظ أن ال عمالو يختلف عن الهامش ,عاج فالهامش هو المسافة 
بين الإطار و بين الكلام المحيط بالصورة e‏ 2 هذه ا أكثر 


سے پت ا E‏ ا س 

surrounding text 3 
2 : اپ‎ 
و‎ 1 1 4 

1 : 
٣ Left ! | Right چ‎ 
3 1 E 
:َ E BM OEE RO OEE O OOO RRR OG a, س‎ 2 
1 Bottom # 


شريط أدوات اضر Picture Toolbox‏ 
يمكنك أظهار أو إخفاء شريط أدوات الصور و ذلك باختیار الأمر وط1ا٥ه]‏ من قائمه سع۷1 ثم تحديد 
شریط الأدوات یع ں)Pic‏ 


o This PDF Was created using the Sonic PDF 'Cموtor: من ۲۰ حقوق الطب‎ ۲۱١ 


To remove this watermark, please license this product al www.investintech.com 


ادارة منية النصرالتعليمية - تو جيه الكمبيوتر اعداد حامد كيوان - موجه كمبيوتر 


: تک کپ کچ“ ج ا س - ا - ¬ 
ا 2 کی 7 EET‏ جے TTT EF eT FT‏ ا ا کی 


LR E‏ ا | کک طك ت 2ھ ا ےل کو ا کا 


2 Fz ua MII IO GE | a 


.1 
a 
کے‎ r 


1 N n E 
5 ا‎ E i ا‎ i 


1 
1 
n 


هيا نتعرف علي الأوامر الموجودة في شريط أدوات الصور 
کہا 


اکا 


شات 0۲ ف 
o ©‏ ا 
ior |‏ 


O٣‏ ای 


SE FC 


و وظائفهم على الترتيب : 

إضافة صورة من ملف 

تحويل الصورة إلي ازور اص uط"۲‏ ( سيتم شرح ال انور اص uط1‏ في الفقرة التالية ) 
تدوير الصورة جهة اليمين أو اليسار 

عكس الصورة في الاتجاه الأفقي أو الراسي 

زيادة / إنقاص التباين في الصورة 

زيادة / إنقاص السطوع في الصورة 

لقص جزء من الصورة 

لتحويل لون معين في الصورة إلي شفاف 

لتحويل الصورة إلي ( ابيض / اسود ) أو إلي ( شفاف ) 
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إضافة تأثير ( بروز ) للصورة 

تغير مساحة الصورة في الملف إلي الحجم الحالي في الصفحة 
إضافۂ 0٤‏ م٥‏ ( سیتم توضیحھا بعد فقرتین ) 

أعاده الصورة إلي وضعها قبل التعديلات 


إضdl Thumbnail]‏ 
ما هو ال انورطصںط"۲ ؟.... هو وضع نسخه مصغره من الصورة عند الضغط عليها يتم فتح الصورة 
الاصليه في صفحه جديدة 
و متي نحتاج لوضع الصورة ک ازھرطاہںطآ ... مثلا نت تنشئ صفحه کالبوم صور ... حیث سیتم 
عرض عدد كبير من الصور في هذه الصفحة .. لو انك وضعت الصور بحجمها و مساحاتها الحقيقية 
سيصبح تحميل هذه الصفحة عبأً حقيقي يحتاج لوقت طويل كما ان تنسيقها سيكون صعب للغاية ...لهذا 
تلجأ إلي تحويل الصور إلي اذھرb(صuط"آ‏ 
بالتأكيد أنت رأيت أمثله كثيرة لهذه الصفحة ... مثلا في مواقع الإهداء و إرسال كروت التهنئة .. تجد الكثير 
من الكروت معروض في صفحه واحده بشكل مصغر و عند الضغط عليه يتم فتح الكارت بحجمه الحقيقي 
فى صفحه منفصلة 
أيضا في مواقع الصور و الخلفيات 
و في مواقع التعارف يتم عرض صور المشتركين بهذا الشكل 
کیف يمکن |iشiء‏ أ Thumbnail]‏ 
ببساطه اضغط بالزر الأيمن الماوس ا٣‏ ٤1عR1‏ علي الصورة المطلوب تحویلھا ثم اختر الأمر Auto‏ 
n11اصıط"1‏ من القائمه المختصرة أمامك .. لاحظ الشكل 
ستجد البرنامج قد قام بتصغير الصورة ... قم الآن بمعاينه الصفحة ( اضغط ۱۲۴ للمعاينة ) و جرب أن 
تضغط علي الصورة المصعرة .. تجد المتصفح قد قام بفتح صفحه جديدة تحوي الصورة الإصليه بحجمها 
الحقيقي 
هل يمكنني التحكم في طريقه عرض الصورة ألأصليه ؟... كلا لا يمكنك هذا في هذه المرحلة .. في المراحل 
المتقدمة من البرنامج سنتعلم معا كيف يمكننا فعل هذا 
sli‏ آ Hotspot‏ 
أعتقد أنكم جميعا ستحبون هذه المهارة ... 
ال 0۲مء٤٥1‏ هو تحديد جزء من الصورة عند الضغط عليه يتم تحميل صفحه جديدة 
هو يختلف قليلا عن الرابط م1[ .. حيث انك في ال ٤0مء)0]ع‏ تحدد جزء صغير من الصورة .. بمعني انه 
يمكنك تحديد عدة أجزاء علي الصورة تنقلك إلي عدة صفحات مختلفة 
لكي نستوعب المعني بشكل أعمق 
سنقوم في البداية باضا فه صورة كما تعلمنا في البداية 
ثم نظھر شریط أدوات الصور ۲١ ٣٥٥اط ٥×‏ ں)ءز٣‏ کما تعلمنا منذ قلیل 


مستطيل .. قم الآن برسم مستطيل حول ( مصر ) 
عند الانتهاء من رسم المستطيل يفتح البرنامج لك مربع حوار مرذااءمر ١١ء[‏ الدي تعرفنا عليه في 
المحاضرة السابقة .. قم بتحديد الصفحة التي تريدها 


و يمكنك إعادة نفس الخطوات لمجموعه من الأماكن المختلفة علي الصورة ۰ 
تلاحظ ان البرنامج يوفر لك ۳ أدوات لإنشاء ال اممء٤H0‏ و ذلك حتى تستطيع تحديد أي منطقه سواء 


1 **» » ay ھم«‎ 
منتظمه او غير منتظمه بسهوله‎ 
0د‎ b4 1 د‎ 1 IT sı “" «» #@ 4 4 € ° م‎ » 2 b1 مډ‎ 
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فالشكل المستطيل و الدائري للأشكال المنتظمة أما الشكل الثالث فيمكنك من تحديد أشكال غير منتظمة 
م ا هي ال 9 ارط e0‏ 
تأتي قوة أي موقع من مدي سهولة التنقل بين مختلف صفحاته و إمكانيه الوصول لأي من مواضيعه 
بمنتهي اليسر» و الروابط هي تلك الخاصيه التي تمكنك من الأنتقال بين صفحات الموقع بسهولة أو 
حتي الأنتقال لأي صفحات خارج الموقع. 
الروابط هي من العناصر الأساسيه في اي موقع ... حيث يتم دائما ربط صفحات الموقع ببعضها البعض 
حتي يسهل علي المستخدم الأنتقال بين أقسام الموقع و الأستفاده من کافه خدماته بکل یسر و سهوله. 
انش اء الروابط . 
هناك عدة أنواع من الروابط و لكن يتم أنشاء اغلبها بنذ بنفس الطريقه ... هيا نستعرض معا كيف يمكننا 
أنشاء رابط داخل الصفحة نبداً موقع جدید من صفحه واحده . 
أنشئن صفحه جديدة ڊjlyiz About_us.htm‏ 
قم بإضافة بعض المعلومات عنك في صفحه ١۳٣)ط.یں_٤‏ 0 ط۸ مثل الاسم و السن و تاريخ الميلاد و ما 
إلي ذلك الان نحن نريد أن نضع رابط في الصفحة الرئيسية ١)ط.٤اuدfعك‏ بحيث يقوم بتحميل صفحه 
About_us.h tm‏ عند الضغط عليه . .. هيا لنري كيف سنتمكن من ذلك في الصفحة الرئيسية اصف 
جمله ' لا 0u٤‏ ط۸" باستخدام الماوس قم بتحديد هذه الجمله ثم اضغط كليك يnميù Right Click‏ 
من القائمه المختصرة افختر الأمر Hyperlink‏ 
لاحظ ظهور ر مر © حو وار E‏ ا کما اا 


= ۳ 
—-. ا r — = Ei‏ کے 
کو 7 ج ر E‏ سے سے ص 


Insert Hyperlink 


Link: Eo: Text to display: | About us EFEENTIH 5. 


| آ‎ Lookin: ا‎ C:Documerês ard settings lhatlezo, MIH Û اھ ا‎ a a lë 
Exsting Fi or j 
eb Page ا‎ 2 2 Documents ard zettingslba ezo. L4 Beute Web Fes: 1. Bookmark Backmtatk 
i | | Uren 2 Cr {Dorumerts and Settingsbazlezo. 14E Documents Web Ses: 


E 2ا‎ About us; him | Target Framer. | a 


Plate in Thi 8] defauk. hin ج‎ 


pocimerit Braised Parameters... چ‎ 
Pages 1 
إا‎ 


fEeate ev HêtenE 
2 Dacuerit Files 


E‏ 3 : ت 
jp‏ 


ا :5 0 
ا ےا 
! ا 


4 
1 
1 
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ا 
۳ 
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الآن نحن نريد أضافه رابط لصفحه "اط.ئں_ا0uط۸‏ التي تم اشائها فعليا في الخطوه السابقه . 
| 
Insert Hype rlink‏ 
E ) Text EO HiSplay About 5‏ ۳ 


ق 


Look in: 5 cC: Doc mers ard Set tings\ba2leza. m1 4l Dw 5 2 E 21‏ ا 


| Existing File or 
| Web Page | 
E أ‎ UrFENE 


ً Frhlegt EFESERTT e [ أ‎ |. Target Framê... اعد ا‎ 
DO Ea =e 1-1 FA r1 : E 


3 CC: \Documents an arid Seti zttingsibazlezo. PALATE ip yeb ites Bonkrmmatk: 
: شتا س‎ MIHREY GocurmErê zirh, Web Sites! Fo 


Place iri This 


Cer mêriE Brose d آ ی ت چ‎ = 
Pages E. 38 
Î GeakeNew Reçen ' ‘Choose a page you apf 
E e want to link to from l4 

1 this list 5 1 

Aidress! About us. htm El 1 


| ees 
1 
ستلاحظ أن الصفحات التي قمت بإنشانها ضمن موقعك بالكامل موجودة اختر منها صفحه‎ 
0 بعد اختیار الصفحة اضغط‎ طout_us.htm‎ 
١۲۴ الآن لتجربه الرباط الذي قمت بإنشائه قم بمعاينه الصفحة الرئیسيه عن طریق ضغط‎ 
لاحظ انه لتجربه الرابط يجب عليك الأنتقال لمعاينه الصفحه حيث لن يعمل الرابط في وضع التصميم‎ 
الان نحن نريد أنشاء رابط اخر في الصفحه الرئيسيه لينقل المستخدم لصفحه بعنوان‎ 
o us.htm 
تذكر إننا لم ننشئ صفحه "٠ا.ئu_اءد٤«ه€ بعد .. فهل يمكن أنشاء رابط لصفحه في الموقع لم‎ 
About_us.htm تنشئ بعد ام اننا یجب ان ننشئھا اولا كما فعلنا مع صفڪ4‎ 
كلا يمكنك أنشاء رابط لصفحه لم يتم انشائها بعد .. هيا لنري كيف‎ 
. أضافه رابط لصفحه داخل الموقع لم يتم انشائها بعد‎ 
و التي سيقوم المستخدم بالضغط عليها‎ C٠«)دء)‎ 0S في الصفحة الرئيسية قم باضافه جمله‎ 
Right Click باستخدام الماوس قم بتحديد هذه الجمله و اضغط كليك يمين‎ 
Hyperlink من القائمه اتر !مر‎ 
سيقوم البرنامج بفتح مربع حوار kصاااءمرط اامءم!] ... و لكن كيف يمكننا اخباره ان الصفحه التي‎ 
.... نريد الربط عليها لم تنشئ بعد ؟‎ 
Create New Document رتخÎ‎ :Link (0 من الجزء علي اليسار و المسمي‎ 


ثم أتبع الخطوات كما بالشكل 
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| Insert Hyperlink xX 

1 Link tû: Text Ea display: About U5 a ا ا‎ 
0 amie ûf AE document: 

sting E or | Contact 1E | | 
eb Fage Ta “an type name to creat a new 
file: IC Documents and Settingslba2lezo.mi Amy Pagê which you will link to 
1 2 i ded 4 
٣ Place ifi This made 1 

arcurmer as example Contact_Us 
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hen Eo Edif: 
E Me 
DocurmêEnk 


(CY Edi the new document later 


7 
E Rl 
1. 1 


(e) Edit he new document row 


| E-mail Address 


لاحظ الان ك 2 e‏ إقام ب بانشاء صفحه جديدة بعنوان Contact hi‏ 


EAE E Ee SHE r Fora تت ا‎ 
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î default. hrm REE E 
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كما قام بإنشاء الرابط في الصفحه الرئيسيه . 

قم الآن بمعاينه الصفحة الرئييه و تأكد من ان الرابط الجديد يعمل جيدا 

صفحه ١1ا.ئu_اءهوا«ه€‏ يتم استخدامها في المواقع للتواصل بين زائري الموقع و بين فريق الإعداد 
الخاص بالموقع .. سواء للأبلاغ عن مشكله او لطلب معين او لأبداء الراي الي اخره . 

دعنا نري الآن كيف يمكن أنشاء رابط يستخدمه الزائر لأرسال بريد 5-131 الي فريق اداره الموقع 
إضافة رابط للتراسل . 

في صiڪ4 Contact_us.ht‏ ةم ڊبأضاف4 ج4la “For Your Feedback ... Click Here”‏ . 
قم بتحديد جملة ١۲٥ط‏ ا1ا بأستخدام الماوس ... ثم اضغط كليك یمین اا٣‏ ٤[عR‏ و اختر الامر 
Hyperlink‏ 

لاحظ ظھور مربع حوار kہااا٤Hyp insert‏ من الجزء الخاص ب ١ا :[٥ ٥k‏ اختر 

E-mail| Address‏ لاحظ الشکل 
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mou 
آ‎ E 1 
ا۴ ۳ إ‎ 
0 | r 
r” 


. Insert Hyperlink £ 
5 Link ta: Text to displêy: | mal me 


a 0 E-mêl affesê: 
2 Exetng Fle DF _mailto:mahamed rushde@yahooicom ê 
ا‎ 1 subjegtt: : 

2 ج‎ Feed Back ې‎ 
TL | Flaten This Recently used e-mal addresses: 

2 
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ca 1 ا‎ 


سے ا 


ویاو ا ا کی کے کے نے 
لآن يمكنك أضافه عنوان الإيميل الذي ترغب في ا استقبال الرسائل من زائري ery‏ عليه 

كما يمكنك تحديد عنوان الرساله ايضا في الجزء الخاص ب )٤ع‏ زط Su‏ 

بعد الانتهاء اضغط ]0 ... قم بحفظ الصفحه ثم معاينتها و لاحظ عند الضغط علي جمله ١٠إءh Click‏ 
يتم تشغيل برنامج الإيميل الموجود بالجهاز 

ملاحظه ... هناك طرق أكثر تقدما يمكن بها التواصل بين الزائرين و اداره الموقع إلا أنها مبنيه كليا 
علي استخدام الأكواد و لغه جافا ... و سنتعرض ان شاء الله لها بالتفصيل في مرحله متقدمه من 

تصميم المواقع في نفس الدوره الحاليه 
حتى الآن استطعنا أن ننشئ ۳ انواع من الروابط و لكن كلها داخل موقعنا ... تري هل يمكن انشاء 
رابط لموقع اخر ؟ .... تابع معنا 


اضافه رو ابط لصفحات خارجية 
لنفترض الان انك تريد أنشاء جزء خاص في موقعك تسميه 'مواقعي المفضله ' مثلا .. حيث ستضع به 
اسماء المواقع المفضله عندك كما يمكن للزائر ان يضغط علي اسم الموقع لنتقل اليه . 
نعود الآن للصفحة الرئيسية في الموقع الذي نعمل عليه حاليا .. و دعنا نضيف بها هذه الفقره 
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Telcome to my web site 
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InmstIUuctor on-Hne 


e IEE E CESS e 2m EI 
: of site actress ii diferent programming fields and graphıcs 
|| tS Bitte site... Cek herel sss 
ا‎ 
ا‎ 


الآن قم بتحديد كلمة ٠۲ط‏ 1ا٣‏ باستخدام الماوس .... ثم اضغط كليك يمين .. و اختر hyperlink‏ 
تماما كما فعلنا في المرتين السابقتين 
ثم من مربع حوار kمنااءم‏ ر8 ٤۲مءہ!]‏ تابع الخطوات كما بالشکكل 


Insert Hyper link 
ak Text to display: About us 
: 


8 ) Look in: 


| Existing File ûr 
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.- n 


Web Pagê J| hntslMy Web Sites: 
Uren 0 
Elder Type the Address of the tsy Web Sikes 
کر‎ site you want link to 
Place in This 
Document Browsed as example 
: Pages | wurw.instructoronline,110mb.com, 
= ا‎ 
ل‎ Creal EN Recent 
Docurmerit Files 


N 
ا‎ 1 
... قم بحفظ ثم معاينه الصفحه و اختبر الرابط لتتأكد من عمله‎ 

أضافه روابط لجز ء داخل نفس الصفحه 

إذا كانت الصفحة تحتوي علي مقال علمي او موضوع طويل مقسم الي مجموعه العناوين ... سترغب 
في وضع فهرس في بدايه الصفحه ينقل الزائر عند الضغط علي اي عنصر من عناصره الي هذا العنصر 
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مباشره دون الحاجه اللي قراءة الموضوع كاملا .دعنا نري سويا كيف يمكننا اضافه مثل هذا الرابط 
في البدايه دعنا ننشئ صفحه جدیده و لیکن اسمها Subject.)‏ 
سننشئ فهرس كما بالشكل_ 


ي با بداية هذه الصفحة 


Book Content 
Chapter 1 
Chapter 2 
Chapter 


whapter 4 


بعد کتابه س أأضغط 8,٤٥۲‏ بشكل متكرر لأضافه مجموعه من السطور الفارغه ... ستظل 


تضغط ٤1)٥۲‏ حتي تختفي 


تختفي السطور السابقه تماما من امامك 


ثم اكتب جملة Beginning of Chapter‏ ۱ او يمكنك کتابه اي جمله تعبر بها عن بدایه الفصل الاول 


سنقوم الان بتعريف هذه الجمله و اعطائها عنوان مميز حتي يمكننا الربط عليها 


Bookmark Û العملي4‎ 


قم بتحدید جمله ١ع)م‏ €2 اه Beginning‏ ۱ باستخدام الماوس ... ثم من قائمھ ۲۲٥ہ[‏ اختر 


)»ص B00‏ ولاحظ ظهور مربع الحوار التالي 
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EzokErmarkTnarmEë:‏ ا[ 
Chapter 1‏ 


* oFher bookmarks on Ehis pPagë: 


في خانه 1۴ھ" 1 اكتب 1Chapter‏ 
الآن انتهينا من أعداد الجزء الذي سنقوم بالربط عليه 
قم بتحديد كلمة ١ءام‏ ه1٣۱‏ التي كتبتها في الفهرس 
و تابع الخطوات كما بالشكل 


حقوق الطب 


... و تسمي هذه 


الامر 


.. نعود الان لبدايه الصفحه . 
... ثم كليك يمين و اختر !مر Hyperlink‏ . 
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أ‎ | E-mail Address 2 
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ا | 
ایا ١ NS‏ ا و ا اقا واوو ی ر وو ی کوج یو ی ا کک 


قم الآن بمعاينه الصفحة بعد حفظها و تأكد من ان الرابط يعمل . 
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